<script>
import { ref } from 'vue';
const searchQuery = ref('');
import axios from 'axios';

export default {
  name: "demo1",
  data(){
    return {
      baiduData: null,
      url:"https://www.baidu.com/",
    }
  },
  methods: {
    openBaidu() {
      window.open('https://www.baidu.com','_search');
    },
    fetchBaiduData() {

      axios.get('https://api.baidu.com/some-endpoint')

          .then(response => {

            this.baiduData = response.data;

          })

          .catch(error => {

            console.error('Error fetching data from Baidu:', error);

          });

    },
    initBaiduMap() {

      const map = new BMap.Map('baiduMap');

      const point = new BMap.Point(116.404, 39.915);

      map.centerAndZoom(point, 15);

    },
    OpenWindow(){
      var height = 500;
      var width = 400;
      var top=Math.round((window.screen.height-height)/2);
      var left=Math.round((window.screen.width-width)/2);
      window.open("https://www.baidu.com/baidu?tn=34046034_10_dg&ie=utf-8&wd=%E6%97%A5%E5%8E%86%E6%9F%A5%E8%AF%A2", "",
          "height=" + height + ", width=" + width + ", top=" + top + ", left= " + left + ", toolbar=no, menubar=no, scrollbars=auto, resizable=no, location=yes, status=no");
    },
  },mounted() {
    this.fetchBaiduData();
    this.initBaiduMap();
  }

}
</script>

<template>
  asdsd
  <div>
<!--    <iframe src="https://www.baidu.com" width="100%" height="600px"></iframe>-->
    <iframe
        :src="url"
        frameborder="0"
        align="middle"
        width="100%"
        height="800px"
        allowfullscreen>
    </iframe>


    <!--    <button @click="openBaidu">访问百度</button>-->
    <button @click="openBaidu">访问百度</button>

<!--    <div style="width: 600px;height: 400px;border: 1px saddlebrown solid">{{ baiduData }}</div>-->
  </div>

<!--  <webview v-show="posdatas.sfym" :src="www.baidu.com" />-->

  <div id="baiduMap" style="width: 100%; height: 500px;"></div>
</template>

<style scoped lang="less">

</style>
